<template>
    <div class="" style="padding: 40rpx">
        <u-textarea
            ref="textareaName"
            height="600rpx"
            v-model="description"
            :customStyle="textAreaCustomStyle"
            placeholder="请输入内容"
            fixed
            count
            maxlength="800"
        ></u-textarea>
        <view class="purchase safeAreaBottom flex_wrap">
            <u-button
                text="保存"
                color="#588BF3"
                :hairline="false"
                shape="circle"
                @click="okDescription"
            />
        </view>
    </div>
</template>

<script>
//这里可以导入其他文件（比如：组件，工具js，第三方插件js，json文件，图片文件等等）
//例如：import 《组件名称》 from '《组件路径》';

export default {
    //import引入的组件需要注入到对象中才能使用
    components: {},
    data() {
        //这里存放数据
        return {
            description: "",
            textAreaCustomStyle: {
                backgroundColor: "#fff",
                color: "#303133",
                width: "100%",
                padding: "20rpx",
                paddingBottom: "40rpx",
                boxSizing: "border-box",
                fontSize: "26rpx",
                borderColor: "#fff",
            },
        };
    },

    onLoad(e) {
        this.description = e.description;
    },
    //方法集合
    methods: {
        okDescription() {
            if (!this.description && !this.description.trim().length)
                return uni.$u.toast("请输入课程简介！");
            setTimeout(() => {
                uni.$emit("description", this.description);
            }, 500);
            uni.navigateBack({
                delta: 1,
            });
        },
    },
};
</script>
<style lang="scss" scoped>
//@import url(); 引入公共css类
.purchase {
    position: fixed;
    min-height: 116rpx;
    bottom: 0;
    left: 0;
    right: 0;
    width: 100vw;
    height: auto;
    padding: 18rpx;
    background: #ffffff;
    box-shadow: 8rpx 0px 8rpx 2rpx rgba(0, 0, 0, 0.25);
}
</style>
